<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>青鸟总部</title>
    <style>
        body{
            height: 8000px;
        }
        #nav {

            margin: 0 auto;
            position: relative;
            border: 2px solid #959595;
            width: 1300px;
            height: 400px;
        }

        #nav #menu {
            position: absolute;
            left: 530px;
            bottom: 20px;

        }

        #nav #menu li {
            list-style: none;
            float: left;
            background-color: #01db04;
            height: 15px;
            width: 15px;
            margin-left: 15px;
            border-radius: 50%;

        }

        #nav #menu li:hover {
            background-color: white;
            cursor: pointer;

        }

        .clear:after {
            display: block;
            height: 0;
            content: '';
            clear: both;
        }

        #wechat1{
            position: fixed;
            right: 0px;
            top: 50%;
        }
        #wechat2{
            position: fixed;
            right: 0px;
            top: 75%;
        }
    </style>
</head>
<body>
<div id="nav">
    <img src="http://assets.bdqn.cn/upload/ad/1594716696132454.jpg?1594782635" width="1300px" height="400px"/>
    <ul id="menu" class="clear">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <div id="wechat1">
        <img src="https://t8.baidu.com/it/u=3539787636,1156254001&fm=193" height="100px" width="100px">

    </div>
    <div id="wechat2">
        <img src="https://t9.baidu.com/it/u=616425418,458298767&fm=193" height="100px" width="100px">
    </div>
</div>

</body>
</html>